<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>管理员登录</title>
</head>
<link rel="stylesheet" href="../../style/login.css">

 <script src="../../plugins/vue/vue.js"></script>
<script  src="../../plugins/axios/axios.min.js"></script>
<link rel="stylesheet" href="../../plugins/element-ui/index.css">
<script src="../../plugins/element-ui/index.js"></script> 
<body >
    <div class="login" id="app" style="height:695px ;">
			<div class="login-box">
			  <img src="../../images/login/a.jpeg" alt="">
			  <div class="login-form">
				<el-form ref="loginForm" :model="loginForm" :rules="loginRules" >
				  <div class="login-form-title">
					<img src="../../images/login/yy.png"  style="width: 130px; height: 40px"   alt="" />
				  </div>
				  <el-form-item prop="username">
					<el-input v-model="loginForm.accountNumber" type="text" auto-complete="off" placeholder="账号" maxlength="20"
					  prefix-icon="el-icon-user" />
				  </el-form-item>
				  <el-form-item prop="password">
					<el-input v-model="loginForm.password" type="password" placeholder="密码" prefix-icon="el-icon-lock" maxlength="20"
					  @keyup.enter.native="handleLogin" />
				  </el-form-item>
				  <el-row :gutter="20">
					<el-col :span="14" style="margin-left: 40px;">
						<el-form-item style="width:100%;" >
							<el-button :loading="loading" class="login-btn" size="medium" type="primary" style="width:100%;"
							  @click.native.prevent="handleLogin">
							  <span v-if="!loading">登录</span>
							  <span v-else>登录中...</span>
							</el-button>
						  </el-form-item>
					</el-col>
				  </el-row>
				</el-form>
			  </div>
      </div>
    </div>
</body>
<script>
    new Vue({
        el:"#app",
        data:{
			   loginForm:{
				  /* accountNumber: 'admin',
				  password: '123',*/
				   accountNumber: '',
				   password: '',
			    },
				loading: false,
				dialogFormVisible: false,
				
		   },
		   computed: {
				loginRules() {
				const validateUsername = (rule, value, callback) => {
					if (value.length < 1 ) {
					callback(new Error('请输入用户名'))
					} else {
					callback()
					}
				}
				const validatePassword = (rule, value, callback) => {
					if (value.length < 1) {
					callback(new Error('密码不能为空'))
					} else {
					callback()
					}
				}
				return {
					'account_number': [{ 'validator': validateUsername, 'trigger': 'blur' }],
					'password': [{ 'validator': validatePassword, 'trigger': 'blur' }],
				}
				},

      },
      created() {
      },
      methods: {
        async handleLogin() {
          this.$refs.loginForm.validate(async (valid) => {
            if (valid) {
				//this.$message.info("登录"+this.loginForm.accountNumber+"---"+this.loginForm.password);
              this.loading = true
              axios.post("/admin/login",this.loginForm).then((res) =>{
				  if(res.data.code == "1"){
					  sessionStorage.setItem("adminId",res.data.data.adminId);
					  sessionStorage.setItem("employeeName",res.data.data.employeeName);
					 // this.$message.success("登录成功");
					  window.location.href= './index.html'
				  }else {
					  this.$message.error(res.data.msg);
					  this.loading = false;
				  }
			  })

            }
          })
        },
      }
		
	 })
</script>
</html>